
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles" %>
<!-- spring security tag library -->
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>

<tiles:insertDefinition name="mainTemplate">
    <tiles:putAttribute name="body">

        <div class="content">

            <form class="send_message" action="/messages/create" enctype="multipart/form-data" method="post">
                <textarea name="messageText" rows="4"></textarea>

                <!-- show add image upload input only if user is supervisor -->
                <sec:authorize access="hasRole('ROLE_SUPERVISOR')">
                    <input name="imageInput" type="file" accept="image/*" size="15" id="imageUpload"  value="Attach picture">
                </sec:authorize>

                <a class="t-a-button" onclick="manager.sendPost();">Add new post</a>
            </form>

            <div id="posts_container"></div>

            <%--<table>
                <tbody id="posts">
                </tbody>
            </table>--%>
        </div>

    </tiles:putAttribute>

    <tiles:putListAttribute name="scripts" inherit="true">
        <tiles:addAttribute value="/js/feed.js"/>
        <tiles:addAttribute value="/js/manager.js"/>
    </tiles:putListAttribute>

    <tiles:putListAttribute name="templates" inherit="true">
        <tiles:addAttribute>
            <script id="commentsTmpl" type="text/x-jquery-tmpl">

            {{each data}}
           <table class="post_table comment_table" cellpadding="0" cellspacing="0">
                <tr class="post_table">
                    <td class="username_col">
                        <b>{{= commentUsername}}</b>
                    </td>
                    <td class="post_col">
                        {{= commentText}}
                    </td>
                </tr>
            </table>
            {{/each}}


             <div class="well send_message" style="margin-bottom: 0px;margin-top: 10px;">
             <form style="border-top: 2px solid white;" name="send-post-form" action="javascript:manager.sendComment({{= postId}})">
                <fieldset>
                    <p>
                        <b>Enter comment</b>
                    </p>
                    <p>
                        <textarea name="comment_{{= postId}}" rows="4" cols="45"></textarea>
                    </p>
                    <p style="float:right; margin: 0px 0px 0px 0px;">
                         <input class="t-button" name="submit" type="submit" value="Send" />
                    </p>
                </fieldset>
            </form>
            </div>


            </script>
        </tiles:addAttribute>
        <tiles:addAttribute>

            <script id="postsTmpl" type="text/x-jquery-tmpl">

            {{each data}}
            <div class="message" id="post_{{= postId}}">
                <a class="font_medium bold">{{= userName}}</a>
                {{if imageHashId }}
                    <img class="picture" src="/static/images/{{= imageHashId}}"/>
                {{/if }}
                <p class="font_medium">{{= postText}}</p>
                <div class="controls">
                    <img src="/images/close.png" onclick="manager.deletePost({{= postId}})"></img>
                    <img src="/images/comment.png" onclick="toggleComments({{= postId}})"></img>
                </div>

                <div id="comments_to_post_{{= postId}}"></div>
            </div>
            {{/each}}

            </script>

        </tiles:addAttribute>
    </tiles:putListAttribute>


</tiles:insertDefinition>
